<template>
  <div>
    <div>
      <h1>1.获取书籍</h1>
      <button @click="getFn">获取书籍</button>
    </div>

    <hr>
    <div>
      <h2>2.查询书籍</h2>
      <input
        type="text"
        v-model="bookname"
        placeholder='输入书籍名'
      >
      <button @click="send">查询书籍</button>
    </div>
    <hr>
    <div>
      <h1>添加书籍</h1>
      <div><input
          type="text"
          placeholder='书名'
          v-model="bookObj.bookname"
        ></div>
      <div><input
          type="text"
          placeholder='作者'
          v-model="bookObj.author"
        ></div>
      <div><input
          type="text"
          placeholder='出版社'
          v-model="bookObj.publisher"
        ></div>
    </div>
    <button @click="addBook">添加一本书</button>
  </div>

</template>

<script>

import axios from 'axios'
axios.defaults.baseURL = "http://123.57.109.30:3006"
export default {
  data () {
    return {
      bookname: '',
      bookObj: {
        bookname: '',
        author: '',
        publisher: ''
      }
    }
  },
  methods: {
    getFn () {
      axios({
        url: '/api/getbooks',
        method: 'get',
      }).then(res => {
        console.log(res);
      }).catch(err => {
        console.log(err);
      })
    },
    send () {
      axios({
        url: '/api/getbooks',
        method: 'get',
        params: {
          bookname: this.bookname
        }
      }).then(res => {
        console.log(res);
      })
    },
    addBook () {
      axios({
        url: '/api/addbook',
        method: 'post',
        data: {
          appkey: "7250d3eb-18e1-41bc-8bb2-11483665535a",
          ...this.bookObj
        }
      }).then(res => {
        console.log(res);
      })
    }
  }
}
</script>

<style>
</style>